{% extends 'base.html' %}
{% block title %}添加员工{% endblock %}
{% block content %}
<div class="container">
    <div class="panel panel-default" style="border: 1px solid #ffc2c4; border-radius: 8px;">
        <div class="panel-heading" style="background-color: #ff6b81; color: white; font-weight: 600; font-size: 16px; border-radius: 8px 8px 0 0;">
            添加员工
        </div>
        <div class="panel-body" style="padding: 20px; background-color: #fffafa;">
            <form method="post" onsubmit="return check()">
                {% csrf_token %}
                <div class="form-group">
                    <label for="ename" style="color: #ff6b81; font-weight: 500;">员工姓名</label>
                    <input type="text" id="ename" name="ename" class="form-control" style="border: 1px solid #ffc2c4; border-radius: 5px; padding: 10px;" required>
                </div>
                <div class="form-group">
                    <label for="sal" style="color: #ff6b81; font-weight: 500;">工资</label>
                    <input type="number" id="sal" name="sal" class="form-control" style="border: 1px solid #ffc2c4; border-radius: 5px; padding: 10px;" step="0.01" min="0" required>
                </div>
                <div class="form-group">
                    <label for="hiredate" style="color: #ff6b81; font-weight: 500;">雇佣日期</label>
                    <input type="date" id="hiredate" name="hiredate" class="form-control" style="border: 1px solid #ffc2c4; border-radius: 5px; padding: 10px;" required>
                </div>
                <div class="form-group">
                    <label for="deptno" style="color: #ff6b81; font-weight: 500;">部门</label>
                    <select name="deptno" id="deptno" class="form-control" style="border: 1px solid #ffc2c4; border-radius: 5px; padding: 10px;" required>
                        <option value="">--选择--</option>
                        {% for dept in dept_list %}
                        <option value="{{dept.deptno}}">{{dept.dname}}</option>
                        {% endfor %}
                    </select>
                </div>
                <button class="btn" type="submit" style="background-color: #ff6b81; color: white; border-radius: 5px; padding: 10px 20px; font-size: 14px; font-weight: 500;">
                    添加
                </button>
            </form>
        </div>
    </div>
</div>
{% endblock %}

{% block js %}
<script src="../../static/js/jquery-3.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function(){
        $.noConflict();
        // 设置默认日期为今天
        var today = new Date();
        var formattedDate = today.getFullYear() + '-' +
                           ('0' + (today.getMonth() + 1)).slice(-2) + '-' +
                           ('0' + today.getDate()).slice(-2);
        $("#hiredate").val(formattedDate);
    });

    function check() {
        var ename = $("#ename").val();
        var sal = $("#sal").val();
        var hiredate = $("#hiredate").val();
        var deptno = $("#deptno").val();

        if (ename === '' || sal === '' || hiredate === '' || deptno === '') {
            alert("请填写所有字段！");
            return false;
        }

        // 验证工资是否为有效数字
        if (isNaN(parseFloat(sal)) || parseFloat(sal) <= 0) {
            alert("工资必须是大于0的数字！");
            return false;
        }

        return true;
    }
</script>
{% endblock %}